<template>
  <FullScreenDialog :title="dialog.title" :width="dialog.width" :screenFlag="dialog.screenFlag" :visible="dialog.visible"
    v-if="dialog.visible" :showFooter="dialog.showFooter" @onClose="onClose" @onConfirm="confirm">
    <template v-slot:content>
    <!-- 12222 -->
    <!-- 需要什么东西 1 三个组件 2 不知道 3 如何异步加载组件 4 其他优化暂时不知道 -->
    <caseExcel :excel="excel" v-if="fileType==='xlsx'"></caseExcel>
    <caseDocx :excel="excel" v-if="fileType==='docx'"></caseDocx>
    <casePdf :excel="excel" v-if="fileType==='pdf'"></casePdf>
    </template>
  </FullScreenDialog>
</template>

<script setup lang='ts'>
import { reactive, ref } from 'vue'
import {testCaseDownload} from '@/api/test/test'
import caseDocx from '@/components/caseDocx.vue';
import caseExcel from '@/components/caseExcel.vue';
import casePdf from '@/components/casePdf.vue';
import useDialog from '@/hooks/useDialog';
import {getFileType} from '@/utils/index'
const { dialog, onShow } = useDialog()
const onClose = () => {
  dialog.visible = false
}
const excel=ref()
const fileType = ref()
console.log('直接使用的组件');
console.log('直接使用的组件');
console.log('直接使用的组件');
console.log('直接使用的组件');
console.log('直接使用的组件');

const confirm = () => { }
const  show=async(type,row)=>{
  dialog.title=row.fileName
  dialog.showFooter=false
  dialog.screenFlag=true
  onShow()
  const  url = `/testCase/download?fileName=${row.fileName}&path=${row.path}`
  fileType.value = getFileType(row.fileName)
  const res = await testCaseDownload(url)
  excel.value=res
}
defineExpose({
  show
})
</script>
<style scoped lang='scss'>
</style>